<template>
	<view>
		<u-section style="padding: 0 30rpx;" :title="'序号' + (index + 1)" :right="false">
			<block slot="right" v-if="value.editable" >
				<u-button class="u-m-l-20" size="mini" @tap="$emit('edit')"  type="warning">编辑</u-button>
				<u-button v-if="applyType != 3" class="u-m-l-20" size="mini" @tap="$emit('delete')"  type="error">删除</u-button>
			</block>
			<block slot="right" v-if="applyType == 2 && !readonly">
				<u-button v-if="applyType != 3" class="u-m-l-20" size="mini" @tap="$emit('edit')"  type="warning">验收</u-button>
			</block>
		</u-section>
		<u-form style="padding: 0 30rpx;">
			
			<view v-for="(apply, index) in value.ApplyList" :key="index">
				<u-form-item label-position="left" label-align="right" label="品牌" :label-width="150" style="padding: 0;" :border-bottom="false">
					<u-input type="text" inputAlign="right" :disabled="true" :border="false" :value="getBrandName(apply.BrandId)"></u-input>
				</u-form-item>
				<view class="">
					<view v-for="(product, pIndex) in apply.ProductList" :key="'product' + pIndex">
						<view class="u-p-l-30" >
							<u-form-item label-position="left" label-align="right" label="代码及描述" :label-width="150" :border-bottom="true" style="padding: 0; ">
								<u-input type="text" placeholder="" inputAlign="right" :disabled="true" :border="false" :value="getProductName(product.ProductId, apply.ProductBaseList)"></u-input>
							</u-form-item>
							<u-form-item v-if="applyType == 1" label-position="left" label-align="right" label="申请数量" :label-width="150" :border-bottom="true" style="padding: 0; ">
								<u-input type="text" placeholder="" inputAlign="right" :disabled="true" :border="false" :value="product.Number"></u-input>
							</u-form-item>
							
							<block v-if="applyType == 2">
								<u-row>
									<u-col :span="4">
										<u-form-item label-position="top" label-align="center" label="申请数量" :border-bottom="false" style="padding: 0;">
											<u-input inputAlign="center" type="text" :disabled="true" :border="false" :value="product.Number"></u-input>
										</u-form-item>
									</u-col>
									<u-col :span="4">
										<u-form-item label-position="top" label-align="center" label="验收数量" :border-bottom="false" style="padding: 0;">
											<u-input inputAlign="center" type="text" :disabled="true" :border="false" :value="product.CheckNumber"></u-input>
										</u-form-item>
									</u-col>
									<u-col :span="4">
										<u-form-item label-position="top" label-align="center" label="差异数量" :border-bottom="false" style="padding: 0;">
											<u-input inputAlign="center" type="text" :disabled="true" :border="false" :value="product.DifferencesNum"></u-input>
										</u-form-item>
									</u-col>
								</u-row>
							</block>
						</view>
						<u-gap bg-color="#f5f5f5" :height="10"></u-gap>
					</view>
				</view>

				<u-form-item label-position="left" label="申请时间" :label-width="150" :border-bottom="true" style="padding: 0;">
					<u-input :disabled="true" :border="false" inputAlign="right" :value="apply.ApplyTime | date('yyyy-mm-dd hh:MM')"></u-input>
				</u-form-item>
				<u-form-item label-position="left" label="申请备注" :label-width="150" :border-bottom="true" style="padding: 0;">
					<u-input :disabled="true" :border="false" placeholder="" inputAlign="right" :value="apply.Remark"></u-input>
				</u-form-item>
				
				<block v-if="applyType == 2">
					<u-form-item label-position="left" label="验收时间" :label-width="150" :border-bottom="true" style="padding: 0;">
						<u-input :disabled="true" :border="false" placeholder="" inputAlign="right" :value="timeFormat(apply.CheckTime)"></u-input>
					</u-form-item>
					<u-form-item label-position="left" label="验收备注" :label-width="150" :border-bottom="false" style="padding: 0;">
						<u-input :disabled="true" :border="false" placeholder="" inputAlign="right" :value="apply.CheckRemark"></u-input>
					</u-form-item>
				</block>
			</view>
		</u-form>
		<u-gap :height="20" bg-color="#eaecef" :margin-top="10" :margin-bottom="20"></u-gap>
	</view>
</template>

<script>
export default {
	name: 'medals-apply',
	props: {
		index: {
			type: Number,
			default: 0
		},
		applyType: {
			type: Number,
			default: 1
		},
		readonly: {
			type: Boolean,
			default: false
		},
		value: {
			type: Object,
			default() {
				return {
					Type: '',
					ApplyForType: '',
					BrandId: '',
					ApplyTime: '',
					Remark: '',
					BillNo: '',
					State: '',
					StateName: '',
					ProductList: [],
					ProductBaseList: []
				};
			}
		}
	},
	data() {
		return {
			customStyle: {
				height: '50rpx',
				lineHeight: '50rpx'
			},

			selectType: 5,

			brandList: [],
			showBrandPicker: false,
			brandPickerIndex: -1,
			brand: {},

			productList: [],
			showProductPicker: false,
			productPickerIndex: -1,
			product: {}
		};
	},

	created() {
		this.getBrandList();
	},

	methods: {
		timeFormat(time) {
			if(time > 0) {
				return this.$u.date(time, 'yyyy-mm-dd hh:MM')
			}
			return ''
		},
		
		getBrandName(brandId) {
			const brand = this.brandList.find(item => item.Key == brandId);
			if (brand) {
				return brand.Value;
			}
			return '';
		},

		getProductName(productId, productList) {
			const product = productList.find(item => item.Key == productId);
			if (product) {
				return product.Value;
			}
			return '';
		},

		getBrandList() {
			this.$u.api
				.getBrandDic({
					SelectType: this.selectType
				})
				.then(res => {
					const { ResultCode, Module_BrandList, Shell_Pro_BrandList, Entity_Pro_BrandList, Outdoor_BrandList, Medals_BrandList } = res;
					if (ResultCode === 1) {
						if (this.selectType == 1) {
							this.brandList = Module_BrandList;
						}
						if (this.selectType == 2) {
							this.brandList = Shell_Pro_BrandList;
						}
						if (this.selectType == 3) {
							this.brandList = Entity_Pro_BrandList;
						}
						if (this.selectType == 4) {
							this.brandList = Outdoor_BrandList;
						}
						if (this.selectType == 5) {
							this.brandList = Medals_BrandList;
						}
					}
				});
		}
	}
};
</script>

<style lang="scss"></style>
